<!DOCTYPE HTML>
<html>

<head>
    <!-- Support for mobile touch devices -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1, minimal-ui">

    <!-- CSS -->

    <!-- Font awesome CSS for tool icons //"//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">-->
    <link rel="stylesheet" href="lib/font-awesome.min.css">

    <!-- Bootstrap CSS -->
    <link href="lib/bootstrap.min.css" rel="stylesheet">

    <!-- UI CSS -->
    <link href="lib/jquery-ui.min.css" rel="stylesheet">

    <!-- Cornerstone Base CSS -->
    <link href="lib/cornerstone.min.css" rel="stylesheet">

    <!-- Cornerstone Demo CSS -->
    <link href="css/cornerstoneDemo.css" rel="stylesheet">
</head>

<body>
    <div id="wrap">

        <!-- Nav bar -->
        <nav class="myNav navbar navbar-default" role="navigation">
            <div class="container-fluid">
                <div class="navbar-header">
                    <a class="navbar-brand" href="https://github.com/chafey/cornerstone">Cornerstone</a>
                </div>
                <ul class="nav navbar-nav navbar-right">
                    <li><a id="help" href="#" class="button hidden-xs">Help</a></li>
                    <li><a id="about" href="#" class="button hidden-xs">About</a></li>
                </ul>
            </div>
        </nav>

        <div class='main'>

            <!-- Tabs bar -->
            <ul id="tabs" class="nav nav-tabs">
                <li class="active"><a href="#studyList" data-toggle="tab">Study List</a></li>
            </ul>

            <!-- Tab content -->
            <div id="tabContent" class="tab-content">
                <!-- Study list -->
                <div id="studyList" class="tab-pane active">
                    <div class="row">
                        <table class="col-md-12 table table-striped">
                            <thead>
                                <tr>
                                    <th>Patient Name</th>
                                    <th>Patient ID</th>
                                    <th>Study Date</th>
                                    <th>Modality</th>
                                    <th>Study Description</th>
                                    <th># Images</th>
                                </tr>
                            </thead>

                            <tbody id="studyListDatas">
                                <!-- Table rows get populated from the JSON studyList manifest -->
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            <!-- Study viewer tab content template -->
        </div>
    </div>

    <!-- Javascripts -->

    <!-- Include JQuery -->
    <script src="lib/jquery.min.js"></script>

    <!-- Include JQuery UI for drag/drop -->
    <script src="lib/jquery-ui.min.js"></script>

    <!-- Include JQuery Hammerjs adapter for mobile touch-->
    <script src="lib/hammer.min.js"></script>

    <!-- Include Bootstrap js -->
    <script src="lib/bootstrap.min.js"></script>

    <!-- include the cornerstone library -->
    <script src="lib/cornerstone.js"></script>

    <!-- include the cornerstone library -->
    <script src="lib/cornerstoneMath.js"></script>

    <!-- include the cornerstone tools library -->
    <script src="lib/cornerstoneTools.js"></script>

    <!-- include the cornerstoneWADOImageLoader library -->
    <script src="lib/cornerstoneWADOImageLoader.js"></script>

    <!-- include the cornerstoneWebImageLoader library -->
    <script src="lib/cornerstoneWebImageLoader.js"></script>

    <!-- include the dicomParser library -->
    <script src="lib/dicomParser.js"></script>

    <!-- include cornerstoneDemo.js -->
    <script src="js/loadTemplate.js"></script>
    <script src="js/setupViewport.js"></script>
    <script src="js/displayThumbnail.js"></script>
    <script src="js/loadStudy.js"></script>
    <script src="js/setupButtons.js"></script>
    <script src="js/disableAllTools.js"></script>
    <script src="js/forEachViewport.js"></script>
    <script src="js/imageViewer.js"></script>
    <script src="js/help.js"></script>
    <script src="js/about.js"></script>
    <script src="js/setupViewportOverlays.js"></script>
    <script src="js/cornerstoneDemo.js"></script>

</body>

</html>